// 类组件生命周期复习
// 根据可视区窗口的变化时时更新document.title
import React, { Component } from 'react'

export default class classFoo extends Component {
    // 初始值
    state={
        //  浏览器可视区的宽度和高度(获取窗口的宽和高);
        // 浏览器窗口的可视区域是指除了地址栏、菜单栏、功能栏以及状态栏等之外的，我们打开网页能显示的那一部分区域。简单理解僦是，浏览器窗口的可视区域就是可以用来显示的区域。
        size:[window.innerWidth,window.innerHeight]
    }

    onResize=()=>{
        // 修改state
        this.setState({
            size:[window.innerWidth,window.innerHeight]
        })

    }
    // 添加事件
    componentDidMount(){
        // resize：文档视图调整大小时会触发resize事件
        window.addEventListener('resize',this.onResize);
        // 修改可视区的宽高
        document.title=this.state.size.join("x");
    }

    // 更新阶段
    componentDidUpdate(){
        document.title=this.state.size.join("x");
    }
    // 销毁期
    componentWillUnmount(){
        window.addEventListener('resize',this.onResize)
    }
    render() {
        return (
            <div>
                
            </div>
        )
    }
}
